<template>
  <el-tag :type="type" :style="style">{{ label }}</el-tag>
</template>

<script setup>
const props = defineProps({
  row: {
    type: Object,
    default: () => ({}),
  },
  column: {
    type: Object,
    default: () => ({}),
  },
  statusMap: {
    type: Array,
    default: () => [],
  },
})
const type = ref('primary')
const label = ref('')
const style = ref({})
onMounted(() => {
  // 如果有statusShow属性，则通过map控制标签风格
  if (props.row.statusShow) {
    label.value = props.row.statusShow
    if (props.column.statusTypeMap) {
      const curtatusType = props.column.statusTypeMap[props.row.status]
      if (typeof curtatusType === 'object') {
        style.value = {
          backgroundColor: curtatusType.bgkColor,
          color: curtatusType.color || '#fff'
        }
      } else {
        type.value = curtatusType || 'primary'
      }
    } else {
      type.value = 'primary'
    }
  } else {
    if (props.row.status === 'Enabled') {
      type.value = 'success'
      label.value = '启用'
    } else {
      type.value = 'danger'
      label.value = '停用'
    }
  }
})
</script>

<style lang="scss" scoped></style>
